<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2020/5/20
  Time: 15:29
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/css/home.css">
    <link rel="stylesheet" href="/css/common.css">
</head>

<body>

<!--需要将top和foot两个页面进行引用-->
<jsp:include page="top.jsp"></jsp:include>
<!--div+css布局-->
<div class="home-middle">
    <!--    一个左，一个右，两个div需要在一行，需要浮动-->
    <!--    需要上下相隔50px-->
    <div class="jxdt">
        <div class="banner">教新动态</div>
        <div>
            <div class="floatLeft"><img src="../img/m331.jpg" height="250" width="268"/></div>
            <div class="floatRight">
                <c:forEach items="${newsModelList}" var="newsModel">
                    <div>
                        <!--                    h1~h6叫标题,p标签，叫做段落，就会自动换行加一行-->
                        <a href="${newsModel.href}"><h5>${newsModel.title}</h5></a>
                        <a href="#"><p>${newsModel.content}</p></a>
                    </div>
                </c:forEach>
                <%--                <div>--%>
                <%--                    <!--                    h1~h6叫标题,p标签，叫做段落，就会自动换行加一行-->--%>
                <%--                    <a href="#"><h5>日本较大抹茶督饮七叶和茶登陆上海</h5></a>--%>
                <%--                    <a href="#"><p>日本较大的抹茶</p></a>--%>
                <%--                </div>--%>
                <%--                <div>--%>
                <%--                    <!--                    h1~h6叫标题,p标签，叫做段落，就会自动换行加一行-->--%>
                <%--                    <a href="#"><h5>日本较大抹茶督饮七叶和茶登陆上海</h5></a>--%>
                <%--                    <a href="#"><p>日本较大的抹茶餐饮连锁正式登陆上海，其中</p></a>--%>
                <%--                </div>--%>
                <%--                <div>--%>
                <%--                    <!--                    h1~h6叫标题,p标签，叫做段落，就会自动换行加一行-->--%>
                <%--                    <a href="#"><h5>日本较大抹茶督饮七叶和茶登陆上海</h5></a>--%>
                <%--                    <a href="#"><p>日本较大的抹茶餐饮连锁正式登陆上海，其中本较大的抹茶餐饮连</p></a>--%>
                <%--                </div>--%>
            </div>
        </div>
    </div>
    <div class="cpzs">
        <div class="banner">产品展示</div>
        <c:forEach items="${productModelList}" var="productModel" varStatus="aa">
        <c:if test="${aa.count==1}">

        <div class="floatLeft home-product">
            </c:if>
            <c:if test="${aa.count==2}">
            <div class="floatRight home-product">
                </c:if>
                <div><img src="${productModel.imgHref}" height="300" width="300"/></div>
                <a href="${productModel.href}">
                    <div>${productModel.title}</div>
                </a>
                <div>${productModel.content}</div>
            </div>
            </c:forEach>
            <%--        <div class="floatLeft home-product">--%>
            <%--            <div><img src="../img/48_j53b.jpg" height="300" width="300"/></div>--%>
            <%--            <a href="#">--%>
            <%--                <div>蚂蚁上树蚁上蚁上蚁上蚁上蚁上蚁上</div>--%>
            <%--            </a>--%>
            <%--            <div>粉丝200g, 猪肉馅50克。</div>--%>
            <%--        </div>--%>
            <%--        <div class="floatRight home-product">--%>
            <%--            <div><img src="../img/47_s4av.jpg" height="300" width="300"/></div>--%>
            <%--            <a href="#">--%>
            <%--                <div>蚂蚁上树</div>--%>
            <%--            </a>--%>
            <%--            <div>粉丝200g, 猪肉馅50克。丝200g, 猪肉馅丝200g, 猪肉馅丝200g, 猪肉馅</div>--%>
            <%--        </div>--%>

        </div>


    </div>
    <jsp:include page="foot.jsp"></jsp:include>
</body>
</html>